/**
 * 持仓回报
 * Created by KY on 2017/4/18.
 */
define(['ldfw/core', 'application', 'echarts', 'comps/ajax',
        'text!tpl/position/callback.tpl',
        'ldfw/utils/format'],
    function (LDFW, app, echarts, ajax, tpl) {
        return LDFW.Container.extend({
            tpl: tpl,
            className: 'panel-body text-center proDetail',
            initialize: function (data) {
                if (_.isEmpty(data)) {
                    app.router.back()
                    throw new Error('back')
                }
                this.data = data
                this.headerTitle = data.pd_name
            },
            rendered: function () {
                this.initChart()
                this.loadData(this.data)
            },
            loadData: function (data) {
                let _this = this
                let param = {
                    pd_no: data.pd_no,
                    qry_begin_date: 0,
                    qry_end_date: new Date().format('yyyyMMdd')
                }
                ajax.post('pfL.1.208', param)
                    .success(function (resp) {
                        _this.renderChart.call(_this, resp.result)
                    })
            },
            initChart: function () {
                let chart = this.chart = echarts.init(document.getElementById('returnTrend'))
            },
            renderChart: function (list) {
                list = _.sortBy(list, 'rights_regdate')
                let date = list.map(function (item) {
                    return item.rights_regdate
                })
                let option = {
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'line'
                        }
                    },
                    legend: {
                        data: ['提成', '分红'],
                        x: 'left',
                        textStyle: {color: '#b3bcc5'}
                    },
                    axisPointer: {
                        link: {xAxisIndex: [0, 1]},
                    },
                    grid: [{
                        left: 50,
                        right: 50,
                        height: '35%'
                    }, {
                        left: 50,
                        right: 50,
                        top: '55%',
                        height: '35%'
                    }],
                    xAxis: [
                        {
                            type: 'category',
                            boundaryGap: false,
                            axisLabel: {
                                textStyle: {
                                    color: '#b3bcc5'
                                },
                                margin: 16
                            },
                            data: date
                        },
                        {
                            gridIndex: 1,
                            type: 'category',
                            boundaryGap: false,
                            position: 'top',
                            axisLabel: {show: false},
                            data: date
                        }
                    ],
                    yAxis: [
                        {
                            name: '提成(%)',
                            nameTextStyle: {color: '#b3bcc5'},
                            type: 'value',
                            scale: true,
                            max: 100,
                            splitLine: {lineStyle: {color: '#3c3f47'}},
                            axisLabel: {
                                textStyle: {
                                    color: '#b3bcc5'
                                }
                            }
                        },
                        {
                            gridIndex: 1,
                            name: '金额',
                            nameTextStyle: {color: '#b3bcc5'},
                            type: 'value',
                            scale: true,
                            inverse: true,
                            splitLine: {lineStyle: {color: '#3c3f47'}},
                            axisLabel: {
                                textStyle: {
                                    color: '#b3bcc5'
                                },
                                formatter: function (value) {
                                    return value
                                }
                            }
                        }
                    ],
                    series: [
                        {
                            name: '提成',
                            type: 'line',
                            data: list.map(function (item) {
                                return (item.gain_share_rate * 100).toFixed(2)
                            })
                        },
                        {
                            name: '分红',
                            type: 'line',
                            xAxisIndex: 1,
                            yAxisIndex: 1,
                            data: list.map(function (item) {
                                return item.divi_amt
                            })
                        }
                    ]
                }
                this.chart.setOption(option)
            }
        })
    })